<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>添加</title>
</head>
<body>
    <div>
        <div >
            <h1 th:if="${entry.id==null}">添加电子文档</h1>
            <h1 th:unless="${entry.id==null}">修改电子文档</h1>
        </div>
        <form action="/edocEntry/save" th:action="@{/edocEntry/save}" method="post">
            <input th:value="${entry.id}" name="id"  type="hidden" />
            <table>
                <tr>
                    <td>文档名称：</td>
                    <td><input type="text" id="title" name="title" th:value="${entry.title}" required></td>
                </tr>
                <tr>
                    <td>文档摘要：</td>
                    <td><textarea cols="30" rows="5" id="summary" name="summary" th:field="${entry.summary}"></textarea></td>
                </tr>
                <tr>
                    <td>上传人：</td>
                    <td><input type="text" name="uploaduser" id="uploaduser" th:value="${entry.uploaduser}"></td>
                </tr>
                <tr>
                    <td>上传时间：</td>
                    <td><input type="text" name="createdate" id="createdate" th:value="${#dates.format(entry.createdate,'yyyy-MM-dd')}">(yyyy-MM-dd)</td>
                </tr>
                <tr>
                    <td>文档分类：</td>
                    <td>
                        <select name="categoryId">
                            <option th:each="en:${list}"
                                    th:value="${en.id}"
                                    th:text="${en.name}"
                                    th:selected="${en.id==entry.categoryId}"></option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td><input type="submit" id="search-input" value="提交">&nbsp;&nbsp;<input type="reset" value="重置">&nbsp;&nbsp;<a th:href="@{/edocEntry/page}"><input type="button" value="返回"></a></td>
                </tr>
            </table>
        </form>
    </div>
</body>
</html>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
    $(function(){
        $("#title").on("input", function (){
            // 输入过程中清除显示信息
            $("#title").text("");
        }).on("blur", function (){
            // 失去焦点事件中，请求后端检查srCode是否存在
            $.ajax({
                type:"GET",//请求类型
                url: "/edocEntry/titleExist",//请求的url
                data:{ title: $(this).val() },//请求参数
                dataType:"json",//ajax接口（请求url）返回的数据类型
                success:function(data){//data：返回数据（json对象）
                    if(data.exist == 1){
                        //账号已存在，提示错误提示
                        alert("该文档名称已存在");
                    }else if(data.error){
                        // 后台传了错误提示，显示
                        alert( data.error);
                    }
                },
                error:function(data){//当访问时候，404，500 等非200的错误状态码
                    alert("请求异常，请联系管理员解决！")
                }
            });
        })
    })

    $(function () {
        $("#search-input").click(function (e) {
            e.preventDefault(); // 阻止表单默认提交行为，先进行验证

            // 验证文档名称是否为空
            var titleInput = $("#title");
            if (titleInput.val().trim() === '') {
                alert('文档名称不能为空！');
                return;
            }
            // 验证上传时间是否符合格式要求（这里简单检查是否为空，更严格可使用正则等验证格式）
            var createdateInput = $("#createdate");
            var timeFormatReg = /^\d{4}-\d{2}-\d{2}$/; // 定义正则表达式，匹配yyyy-MM-dd格式
            if (createdateInput.val().trim() === '') {
                alert('上传时间不能为空！');
                return;
            }else if (!timeFormatReg.test(createdateInput.val().trim())){
                alert('上传时间格式不正确！');
                return;
            }

            // 如果所有验证都通过，则提交表单
            $(this).closest('form').submit();
        });
    });
</script>